<template>
  <div class="layout-all" style="width:35%">
    <el-form ref="form" :rules="rules" :model="form" label-width="115px">
      <el-form-item prop="account" label="登录账户:">
        <el-input v-model="form.account" placeholder="请输入登录账户" />
      </el-form-item>
      <el-form-item prop="pwd" label="密码:">
        <el-input v-model="form.pwd" show-password placeholder="请输入密码" />
      </el-form-item>
      <el-form-item prop="nickname" label="昵称:">
        <el-input v-model="form.nickname" placeholder="请输入昵称" />
      </el-form-item>
      <el-form-item prop="is_admin" label="是否超级管理员:">
        <el-switch v-model="form.is_admin" />
      </el-form-item>
      <el-form-item prop="status" label="是否启用:">
        <el-switch v-model="form.status" />
      </el-form-item>
      <el-form-item>
        <el-button icon="el-icon-close" circle @click="bk()" />
        <el-button
          type="success"
          icon="el-icon-check"
          circle
          @click="onSubmit('form')"
        />
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      id: 0,
      form: {},
      rules: {
        account: [
          { required: true, message: '请输入登录账户', trigger: 'blur' }
        ],
        nickname: [
          { required: true, message: '请输入昵称', trigger: 'blur' }
        ]
      }
    }
  },
  mounted() {
    if (this.$route.query.id) {
      this.id = this.$route.query.id
    }
    this.init_into()
  },
  methods: {
    onSubmit(formName) {
      const form = this.form
      this.$refs[formName].validate(valid => {
        if (valid) {
          form.id = this.id
          form.is_admin === true ? form.is_admin = 1 : form.is_admin = 0
          form.status === true ? form.status = 1 : form.status = 0
          this.get('/shop/ShopUser/save', form, 'POST').then(e => {
            this.$msg_ok('success', '操作成功')
          })
          this.$router.back()
        } else {
          console.log('error submit!!')
          return false
        }
      })
      console.log('submit!')
    },
    bk() {
      this.$router.back()
    },
    init_into() {
      this.get('/shop/ShopUser/info?id=' + this.id, this.form, 'POST').then(e => {
        this.form = e.info.tpl
        this.form.is_admin === '' || this.form.is_admin === 1 ? this.form.is_admin = true : this.form.is_admin = false
        this.form.status === '' || this.form.status === 1 ? this.form.status = true : this.form.status = false
      })
    }
  }
}
</script>

<style>
.layout-all {
  margin: 10px;
}
</style>
